<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>教练入口</title>
    <link rel="stylesheet" type="text/css" href="css/normalize.css" th:href="@{css/normalize.css}"/>
    <link rel="stylesheet" type="text/css" href="css/demo.css" th:href="@{css/demo.css}"/>
    <link rel="stylesheet" type="text/css" href="css/component.css" th:href="@{css/component.css}"/>
</head>
<style>
    /**
 * 注册提示框样式
 */
    #info{
        display: none;
        width: 200px;
        height: 200px;
        background-color: #000000;
        opacity:0.7;
        border-radius: 30px;
        margin: 150px auto;
        color: white;
        position:absolute;
        left: 43%;
        z-index: 9999999;
    }
    #info p{
        text-align: center;
        font-size: 18px;
        padding: 10px;
    }
</style>
<body>
<div class="container demo-1">
    <div id="info">
        <p id="title">提示</p>
        <span id="msg"></span>
    </div>
    <div class="content">
        <div id="large-header" class="large-header">
            <canvas id="demo-canvas"></canvas>
            <div class="logo_box">
                <p>&nbsp;</p>
                <h2 style="text-align: center;">欢迎 教练</h2>
                <div class="input_outer">
                    <span class="u_user"></span>
                    <input id="username" name="username" class="text" style="color: #000000 !important" type="text" placeholder="请输入账户" required>
                </div>
                <div class="input_outer">
                    <span class="u_pwd"></span>
                    <input id="password" name="password" class="text" style="color: #000000 !important; position:absolute; z-index:100;"value="" type="password" placeholder="请输入密码" required>
                </div>
                <div id="LOGIN" class="mb2">
                    <button class="submit btn" id="loginBtn"  style=" float: left;">登录</button>
                    <a href="/contact-us"><button  class="btn" style="float: right;" >返回</button></a>
                </div>
            </div>
        </div>
    </div>
</div><!-- /container -->
<script src="js/TweenLite.min.js" th:src="@{js/TweenLite.min.js}"></script>
<script src="js/EasePack.min.js" th:src="@{js/EasePack.min.js}"></script>
<script src="js/jquery.js" th:src="@{js/jquery.js}"></script>
<script src="js/demo-1.js" th:src="@{js/demo-1.js}"></script>
<script>
    $(function () {
        $("#loginBtn").click(function () {
            var user = new Object();
            user.username = $("#username").val();
            user.password = $("#password").val();
            $.post("/userLogin",user,function (data) {
                if(data==3){
                    window.location.href="index-coach";
                }else{
                    $("#info").css("display","block");
                    $("#msg").html("<p>账号或密码错误</p>");
                    window.setTimeout(function(){
                        $("#info").css("display","none");
                    },1500);
                    return false;
                }
            });
        });
    })
</script>
</body>
</html>